<template>
  <div class="titleBar">
    <table v-for="(item, index) in title_data" :key="index">
      <tr>
        <td rowspan="2"><el-image style="width: 30px; height: 30px" :src="item.image"></el-image></td>
        <td>
          <span>{{ item.name }}</span>
        </td>
      </tr>
      <tr>
        <td>
          <span>{{ item.machine }}</span>
        </td>
      </tr>
    </table>
  </div>
</template>

<script>
import first from '@/assets/testMenu/title_icon/first.png'
export default {
  name: 'titleBar',
  data() {
    return {
      title_data: [
        { image: first, name: '机器', machine: '8' },
        { image: first, name: '机器', machine: '8' },
        { image: first, name: '机器', machine: '8' },
        { image: first, name: '机器', machine: '8' },
        { image: first, name: '机器', machine: '8' },
        { image: first, name: '机器', machine: '8' },
      ],
    }
  },
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.titleBar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
 
}
</style>
